<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns:th="http://www.thymeleaf.org">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>找回密码 - 千利千寻 - 中国领先互联网金融导购返利平台</title>
<link rel="stylesheet" th:href="@{/front/plugin/bootstrap-3.3.5/css/bootstrap.min.css}">
<link rel="stylesheet" th:href="@{/front/plugin/bootstrapvalidator/dist/css/bootstrapValidator.min.css}"/>
    <script src="https://cdn.bootcss.com/jquery/2.1.4/jquery.min.js"></script>
    <script src="https://cdn.bootcss.com/bootstrap/3.3.4/js/bootstrap.min.js"></script>
<script type="text/javascript" th:src="@{/front/plugin/bootstrapvalidator/dist/js/bootstrapValidator.min.js}"></script>
<style type="text/css">
<!--
body { margin-left: 0px; margin-top: 0px; margin-right: 0px; margin-bottom: 0px; background-color: #FFFFFF; }
a:link { text-decoration: none; color: #2eb971; }
a:visited { text-decoration: none; color: #2eb971; }
a:hover { text-decoration: underline; color: #2eb971; }
a:active { text-decoration: none; color: #2eb971; }
.inp1 { border: 1px solid #FFFFFF; background-color: #FFFFFF; background-repeat: no-repeat; height: 20px; font-size: 14px }
.inp2 { border: 1px solid #cccccc; background-color: #FFFFFF; background-repeat: no-repeat; height: 30px; font-size: 14px }
.inp3 { border: 1px solid #cff3e3; background-color: #F3FcF8; background-repeat: no-repeat; height: 40px; font-size: 16px }
.STYLE41 { font-family: "Helvetica Neue,Helvetica,Arial,sans-serif"; font-size: 14px; color: #666666; }
.STYLE42 { font-family: "Helvetica Neue,Helvetica,Arial,sans-serif"; font-size: 14px; font-weight: bold; }
.form-horizontal label{font-weight:100;}
.btn-primary,.btn-primary:hover,.btn-primary[disabled],.btn-primary[disabled]:hover,.btn-primary[disabled]:focus,.btn-primary:focus{background-color:#2EB971; border-color:#2EB971;width:300px;}
.btn-primary.active.focus, .btn-primary.active:focus, .btn-primary.active:hover, .btn-primary.focus:active, .btn-primary:active:focus, .btn-primary:active:hover, .open > .dropdown-toggle.btn-primary.focus, .open > .dropdown-toggle.btn-primary:focus, .open > .dropdown-toggle.btn-primary:hover { background-color: #24945a; border-color: #24945a; color: #fff;
			}
.STYLE43 {font-size: 14px; color: #CCCCCC; font-family: Verdana, Arial, Helvetica, sans-serif;}
-->

.wp{
    width: 350px;
    position: absolute;
    right:300px;
    padding-top: 100px;
}
.sdgf{
    border-radius: 5px;
    box-shadow: 0 0 5px #ccc;
}
.sdgf input{
    height: 50px;
    background: #F4F8F9;
    border:0;
    outline: none;
}
.sdgf button{
    height:50px;
}
</style></head>

<body>
<div th:replace="/front/common::header22"></div>
<div style="position: relative; min-height: 600px;background: url(/front/img/bg_login.png) no-repeat;background-size: cover;">
    <div class="wp">
        <table class="sdgf" width="100%" border="0" align="center" cellpadding="5" cellspacing="0">
            <tr>
                <td width="481" style="padding:20px;background: #fff;">
                    <h2 style="font-size: 20px;font-weight: bold;">找回密码</h2>
                    <form id="MJF_find_form" th:action="@{/findPass}" method="post" class="form-horizontal" data-bv-message="This value is not valid" data-bv-feedbackicons-valid="glyphicon glyphicon-ok" data-bv-feedbackicons-invalid="glyphicon glyphicon-remove" data-bv-feedbackicons-validating="glyphicon glyphicon-refresh">
                        <input type="hidden" name="messageId"/>
                        <div class="form-group">
                            <div class="col-lg-12">
                                <input placeholder="手机号" class="form-control" id="login_phone" name="phone" required type="phone" data-bv-notempty-message="手机号不可为空" data-bv-regexp="true" data-bv-regexp-regexp="^1[0-9]{10}$" data-bv-regexp-message="手机号格式错误" autocomplete="yes" value="" />
                            </div>
                        </div>
                        <div class="form-group">
                            <div class="col-lg-12">
                                <div class="col-lg-7" style="padding-left: 0;">
                                    <input placeholder="验证码" type="text" id="find_vcode" class="form-control" name="vcode" required data-bv-notempty-message="验证码错误" data-bv-regexp="true" data-bv-regexp-regexp="[0-9]{6}" data-bv-regexp-message="验证码为6位数字" autocomplete="off" />
                                </div>
                                <div class="col-lg-5" style="padding: 0;">
                                    <button class="btn btn-primary" id="vcode_btn" style="width: 100%;padding: 0;" >获取验证码</button>
                                </div>
                            </div>
                        </div>
                        <div class="form-group">
                            <div class="col-lg-12">
                                <input placeholder="新密码" class="form-control" id="login_email" name="password" type="password" required data-bv-notempty-message="密码不可为空" data-bv-regexp="true" data-bv-regexp-regexp="[a-zA-Z0-9_]{8,16}" data-bv-regexp-message="请输入8-16位字母数字下划线密码" autocomplete="yes" value="" />
                            </div>
                        </div>
                        <div class="form-group">
                            <div class="col-lg-12">
                                <button type="submit" class="btn btn-primary" style="background: #1C86F4; width: 100%;">找&nbsp;&nbsp;回</button>
                            </div>
                        </div>
                    </form>
                </td>
            </tr>
        </table>
    </div>
</div>
<table width="90%" border="0" align="center" cellpadding="30" cellspacing="0">
    <tr>
        <td height="80" align="center" class="STYLE43">Copyright 2015-2017 glw66.com All rights reserved 版权所有：千利千寻 &nbsp;&nbsp;&nbsp;&nbsp;
    </tr>
</table>
<script type="text/javascript">
	$(document).ready(function() {
		$('#MJF_find_form').bootstrapValidator({
			submitHandler: function(validator, form, submitButton) {
				validator.defaultSubmit();
			}
		});

        $('#vcode_btn').click(function() {
            var phone = $("#login_phone").val();
            $.post("/sendSmsCode",{"phone":phone},function(result){
                $("input[name='messageId']").val(result);
            });
            $(this).attr('disabled', true);
            var $self = $(this);
            var sec = 60;
            $self.html(sec + '秒之后再获取');
            var timer = setInterval(function() {
                sec--;
                if(sec == 0) {
                    $self.html('获取验证码');
                    $self.removeAttr('disabled');
                    clearInterval(timer);
                    return;
                }
                $self.html(sec + '秒后再获取');
                
            }, 1000)
        })
	});
</script>
</body>
</html>
